 <template>
  <div>
    <Header />
    <div class="m_broker">
      <div class="broker_box">
        <p class="title">专家帮选 6 大服务内容</p>
        <p class="text">不推销，全面解读，从您的需求出发</p>
        <div class="service">
          <div v-for="(item,index) in conterList" :key="index" class="service_item">
            <img :src="item.img" alt class="service_item_img" />
            <p class="service_item_text">{{item.text}}</p>
          </div>
        </div>
      </div>
      <div class="broker_box team">
        <p class="title">严苛的团队筛选机制</p>
        <p class="text">只为解决您的购房之忧</p>
        <!-- <img src="../../assets/img/btx.png" alt="" /> -->
        <div class="team_box">
          <div class="team_tt">
            <img src="../../assets/img/tt.png" alt />
          </div>
          <div class="team_text">
            <p>
              <img src="../../assets/img/b1.png" alt />
              拥有丰富的房产经纪经验，读懂客户心理
            </p>
            <p>
              <img src="../../assets/img/b2.png" alt />客户服务满意度是考量经纪团队唯一的标准
            </p>
            <p>
              <img src="../../assets/img/b3.png" alt />严格的培训制度保证团队服务无缝衔接
            </p>
            <p>
              <img src="../../assets/img/b4.png" alt />带看次数超过500+/月，满足房产曝光量
            </p>
          </div>
        </div>
      </div>
      <div class="broker_box">
        <p class="title">瑞鼎法拍经理</p>
        <p class="text">高素质、严要求、更专业</p>
        <!-- <img src="../../assets/img/btx.png" alt="" /> -->
        <div class="broker_tema">
          <img src="../../assets/image/fpjl_1.png" alt class="broker_img" />
        </div>
      </div>
      <div class="team">
        <p class="title">
          瑞鼎法拍经理
          <span style="color:#F3633E">VS</span>普通服务人员
        </p>
        <!-- <img src="../../assets/img/btx.png" alt /> -->
        <div class="broker_tema">
          <img src="../../assets/image/vs.png" alt class="broker_img" />
        </div>
      </div>
    </div>
    <Right />
    <Footer />
  </div>
</template>
<script>
import rem from "@/assets/js/rem.js";
import Header from "@/components/m_file/header.vue";
import Footer from "@/components/m_file/footer.vue";
import Right from "@/components/m_file/right.vue";
export default {
  data() {
    return {
      conterList: [
        {
          text: "政策解读",
          img: require(`@/assets/image/zc_2.png`)
        },
        {
          text: "楼盘分析",
          img: require(`@/assets/image/flpfx.png`)
        },
        {
          text: "楼盘背调",
          img: require(`@/assets/image/flpbd.png`)
        },
        {
          text: "房源匹配",
          img: require(`@/assets/image/ffypp.png`)
        },
        {
          text: "楼盘对比",
          img: require(`@/assets/image/flpdb.png`)
        },
        {
          text: "拍卖过户",
          img: require(`@/assets/image/fpmgh.png`)
        }
      ]
    };
  },
  mounted: function() {
    var hash = window.location.hash;
    var index = hash.lastIndexOf("#");
    if (index != -1) {
      var id = hash.substring(index + 1, hash.length + 1);
      var div = document.getElementById(id);
      if (div) {
        setTimeout(function() {
          $("html, body").animate({ scrollTop: $(div).offset().top - 80 }, 500);
        }, 500);
      }
    }
  },
  components: {
    Header,
    Footer,
    Right
  }
};
</script>
<style lang="less" scoped>
.m_broker {
  .team {
    background: #f5faff;
    text-align: center;
    .title {
      padding-top: 0.26rem;
      font-size: 0.18rem;
      font-weight: bold;
      color: #333333;
    }
    .text {
      font-size: 0.12rem;
      color: #999999;
    }
  }
  .broker_img {
    width: 80%;
    margin: 0 auto;
    padding-top: 0.3rem;
  }
  .team_box {
    padding: 0.3rem 0.26rem;
    .team_right {
      margin-left: 90px;
    }
    .team_text {
      margin-top: 0.22rem;
      font-size: 0.14rem;
      color: #333333;
      line-height: 0.3rem;
      text-align: left;
      img {
        margin-right: 20px;
        width: 0.15rem;
        height: 0.15rem;
      }
    }
    .team_tt {
      img {
        height: 1.51rem;
        width: 2.93rem;
      }
    }
  }
  .broker_box {
    text-align: center;
    .title {
      padding-top: 0.26rem;
      font-size: 0.18rem;
      font-weight: bold;
      color: #333333;
      line-height: 0.3rem;
    }
    .text {
      font-size: 0.12rem;
      color: #999999;
    }
    .service {
      margin: 0.1rem 0;
      overflow: hidden;
      font-size: 0;
      .service_item {
        float: left;
        text-align: center;
        width: 50%;
        .service_item_img {
          width: 0.8rem;
          height: 0.8rem;
        }
        .service_item_text {
          font-size: 0.15rem;
          color: #333333;
          line-height: 0.4rem;
        }
      }
    }
  }
  //   .broker_tema {
  //     padding: 70px 0;
  //   }
}
</style>
